<template>
  <div class="container_box">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="申请设置" name="first" @onSubmit="onSubmit">
          <applySet></applySet>
      </el-tab-pane>
      <el-tab-pane label="分佣设置" name="second" @onSubmit="onSubmit">
        <commissionSet></commissionSet>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
  import applySet from './components/set/applySet'
  import commissionSet from './components/set/commissionSet'
  import {getShareSettings,saveShareSettings} from "@/api/setSharing"
  export default {
    name: 'setting',
    components: {
      applySet,
      commissionSet
    },
    data() {
      return {
        activeName: 'first',
        param:{}
      }
    },
    created() {
      this.getShareSettings()
    },
    methods:{
      handleClick(tab, event) {
        console.log(tab, event);
      },
      getShareSettings(){
        getShareSettings().then(res=>{
          console.log(res)
          if(res.code  == 200){
            if(res.data.levelList){
              this.param = res.data
            }
          }
        })
      },
      onSubmit(val){
        console.log(val)
        val.creatorId = JSON.parse(this.$store.getters.userInfo).id ? JSON.parse(this.$store.getters.userInfo).id : '1'
        saveShareSettings(val).then(res=>{
          if(res.code  == 200){
            this.$message("保存成功")
            this.getShareSettings()
          }
        })
      }
    }
  }
</script>

<style scoped lang="scss">
 .container_box{
    background-color: #f2f2f7;
    height: 100vh;
    margin: 15px 25px;
    background: #fff;
    padding: 15px;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 4px 0 rgba(200, 200, 200, 0.5);
    box-shadow: 0 0 4px 0 rgba(200, 200, 200, 0.5);
  .tabBox {
    width: 100%;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #333333;
    background-color: #FFFFFF;
    padding:0 20px;
    margin-top: 20px;

    p {
      width: 100px;
      text-align: center;
      font-size: 18px;
    }

    .active {
      font-weight: bold;
    }
  }
  }

</style>
